﻿<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>

<fmt:setBundle basename="ApplicationMessage" />
<fmt:setLocale value="zh_CN" />

<!DOCTYPE html>
<html lang="zh-CN">

	<head>

		<%@ include file="/WEB-INF/include/meta.jsp"%>
		<%@ include file="/WEB-INF/include/css.jsp"%>

	</head>

	<body class="ms-theme-blue">

		<%@ include file="/WEB-INF/include/header.jsp"%>
		<%@ include file="/WEB-INF/include/submenu.jsp"%>

		<div class="container-fluid umu-container has-umu-sidemenu">
			<div class="umu-breadcrumb">
				<div class="breadcrumb">培训分类</div>
			</div>

			<div class="panel-default beast-panel beast-panel-layout">

				<div class="panel-body">

					<div class="col-xs-12 beast-panel-layout-right">

						<div class="ms-operation-group pull-right">
							<a href="${ctx.host}/training-categories/first-create" class="btn btn-shadow-success btn-shadow umu-btn" data-target="#create" data-toggle="modal">
								<i class="glyphicon glyphicon-plus"></i>&nbsp;&nbsp;新增一级分类
							</a>
						</div>
					</div><br />

					<div class="umu-breadcrumb-wrapper">

						<div class="row">
							<c:forEach items="${trainingCategories}" var="trainingCategory">
								<c:if test="${trainingCategory.parentId == null}">
									<div class="col-xs-3">

										<div class="col-xs-12 trainning-category">

											<div class="panel panel-default denver-panel denver-panel-layout">

												<div class="panel-heading">

													<span>${trainingCategory.name}</span>

												</div>

												<ul class="list-group">
													<c:forEach items="${trainingCategories}" var="trainingCategorys">
														<c:if test="${trainingCategory.id == trainingCategorys.parentId}">
															<li class="list-group-item"><span><!--${categoryMap[trainingCategorys.parentId]}--> ${trainingCategorys.name}</span>

																<a class="pull-right" style="right: 30px;" href="${ctx.host}/training-categories/${trainingCategorys.id}/first-edit" data-target="#edit" data-toggle="modal">
																	<i class="glyphicon glyphicon-edit"></i>
																</a>
																<a class="pull-right" href="${ctx.host}/training-categories/${trainingCategorys.id}/delete" data-target="#delete" data-toggle="modal">
																	<i class="glyphicon glyphicon-remove"></i>
																</a>
															</li>
														</c:if>
													</c:forEach>

												</ul>

												<div class="panel-footer text-center">
													<a class="hover-no-text-decoration" href="${ctx.host}/training-categories/${trainingCategory.id}/second-create" data-target="#create" data-toggle="modal">
														<i class="glyphicon glyphicon-plus">添加分类</i>
													</a>
												</div>

											</div>
										</div>

									</div>
								</c:if>
							</c:forEach>
						</div>

					</div>

				</div>

			</div>

		</div>

		<%@ include file="/WEB-INF/include/footer.jsp"%>
		<%@ include file="/WEB-INF/include/script.jsp"%>
		<d:resource root="${ctx.resource}/build" type="script" src="js/page/training-category/training-category-list.js" />
		<script type="text/javascript">
			require(['page/training-category/training-category-list'], function(page) {
				page.init();
			})
		</script>
	</body>

</html>